<%-- 
    Document   : VipCenter
    Created on : 2014/4/25, 下午 01:20:25
    Author     : Gjun
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf8">
	<title>會員中心</title>
	<link rel="stylesheet" href="../css/VipCenter.css">
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script src="../js/datepicker/jquery.ui.core.js"></script>
	<script src="../js/datepicker/jquery.ui.widget.js"></script>
	<script src="../js/datepicker/jquery.ui.datepicker-zh-TW.js"></script>
	<script src="../js/datepicker/jquery.ui.datepicker.js"></script>
        <!-- 表單-->
        <script src="/playdoll/scripts/jquery.js"></script>
        <script src="/playdoll/scripts/jquery.validate.js"></script>
                <!-- 表單 -->
        <link type="text/css" href="/playdoll/css/nav.css" rel="stylesheet" media="screen" /> 
        <link type="text/css" href="/playdoll/css/top-bar.css" rel="stylesheet" media="screen" /> 

			
        <style>
	body {
			font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;	
			margin: 0;
			padding: 0;
			color: #000;
			background-color: #000000;
                        
                        width: 100%;
			max-width: 1260px;/* 建議您使用最大寬度，如此版面在大型螢幕上就不致於過寬，讓行保持比較方便閱讀的長度。IE6 並不適用這項宣告。 */
			min-width: 780px;/* 建議您使用最小寬度，如此版面在大型螢幕上就不致於過窄，讓行在側欄中保持比較方便閱讀的長度。IE6 並不適用這項宣告。 */
			margin: 0 auto; /* 兩側的自動值與寬度結合後，版面便會置中對齊。如果將 .container 的寬度設為 100%，就不需要這麼做。 */
			color: #333333;
			font-size: 14px;
			text-align: inherit;
                        
		}		
            
            
            #VIP {
				  width:100%;
				  font-size:1.2em;
			}   
                        .error {
                background: #ffd5d5;

        </style>
        
        <script type="text/javascript">
//判斷password是否一樣
 $(document).ready(function() {
              $("#submit").click(function(){
                  var a = $("#Password").val();
                  var b = $("#confirmPassword").val();
                  if(a == b )
                             alert("修改成功!");
                  else
                            alert(" 修改失敗...");
    })
        
        
        $("#vipform").validate({
                    rules: {
                        Password: "required",
                        ConfirmPassword: {
                            equalTo: "#Password"
                        }
                    }
                   
 });    
 

});


                                   
</script>

	</head>
<body>
     <%@include  file="../WebTool/Top_bar.jsp" %>
        <%@include  file="../WebTool/Logo.jsp" %>
        <h1 class="heading" align="center" style="align:center;color:#ffffff">會員管理中心</h1>
	<ul id="tabs">
		<li class="enable" >會員基本資料</li>
		<li>訂購紀錄</li>
		
           
	</ul>
	<div id="contents">
<!--會員基本資料!-->  
	 <div>
             <form action="../member/update" method="post" id="vipform">
           		<fieldset>
		<table  Cellspacing=15 id="VIP">

                    	  <% if(session.getAttribute("會員編號")==null){ %>
                                <a href="/Login/LoginPart.jsp"> <b1>登入</b1></a>
                                <% }else if(session.getAttribute("會員編號")!=null){  %>
			<tr>
				<td>帳號：</td>
				<td colspan=4><input id="login_account" name="Account" type="text" value=" ${result["account"]}" disabled="disabled"/></td>
			</tr>
			
			<tr>
				<td>＊新密碼：</td>
				<td colspan=4><input id="Password" name="Password" type="password" value="" class="required"/></td>
			</tr>
                        
			<tr>
				<td>＊確認密碼：</td>
				<td colspan=4><input id="confirmPassword" name="ConfirmPassword" type="password" value="" class="required equalTo:#login_password" /></td>		
			</tr>
			
                        <tr>
				<td>姓名：</td>
				<td colspan=2><input id="user_name" name="Name" type="text" value="${result["name"]}" class="required"/></td>
			</tr>
                        
			<tr>
				<td>生日：</td>
				<td colspan=4><input type="text" id="datepicker" name="Birth" value="${result["birth"]}" disabled="disabled"/></td>				
			</tr>
                        
                    
                        <tr>		
                            
				<td>性別：</td>
                                    
                                <td><input id="sex" name="Sex" type="text" value="${result["sex"]}" disabled="disabled"/></td>
                                   
				<td colspan="3";>
					
				</td>
			</tr>
                        
                        <tr>	
				<td>聯絡電話：</td>
				<td colspan=4><input id="phone" name="Phone" type="text" value="${result["phone"]}" class="required maxLength:10"/></td>
				
			</tr>
			
			<tr>	
				<td>聯絡地址：</td>
				<td colspan=4><input id="address" name="Address" type="text" value="${result["address"]}" style="width:350px;" class="required"/></td>
				
			</tr>
			<tr>
				<td>電子郵件：</td>
				<td colspan="4";><input id="email" name="Email" type="text" value="${result["email"]}" style="width:350px;" class="required"/></td>
			</tr>
			<tr>
                            <td align="center" colspan=5 >
                                <input id="submit" type="submit" value="送出修改" class="btn2" />
                            </td>
			</tr>  
                     <% }%>
		</table>
	</fieldset >
  </form>
      
	</div>
<!--訂購紀錄!--> 		
	<div>
            
            <table>
		<table id="VIP" border="1" rules=crows>
       
				<tr >
                                        <td align="center" weight="40%">訂購日期</td>
					<td align="center">商品名稱</td>
					<td align="center">數量</td>
					<td align="center">單價</td>
                                        <td align="center">小計</td>
				</tr>
                                 <c:forEach items="${rt}" var="m1">
				<tr >
                                      	<td align="left">${m1["訂單日期"]}</td>
					<td align="left">${m1["產品名稱"]}</td>
					<td align="right">${m1["數量"]}</td>
					<td align="right">${m1["單價"]}</td>
                                        <td align="right">${m1["小計"]}</td>
                                     
                                </tr>
                                   </c:forEach>
                  </table>
                <table id="VIP">
                  
				<tr>
                                        <c:forEach items="${rt}" var="m1" begin="0" step="1" end="0">
					<td colspan="5" align="right">總金額：${sum}</td>
                                        </c:forEach>
				</tr>
                            
		</table>
            
           </table> 
           
	
	</div>

	<footer>
		
	</footer>
<script src="../js/VipCenter.js"></script>  	


</body>
</html>